/* eslint-disable array-callback-return */
import React, { useState } from 'react';
import { message } from 'antd';
import Item from '../mapItem/item';
import { list, listName, mapPOS, mapRiver, mapRiverBank, mapTrap, gameOver, AList, BList} from './map.json';
import './map.css';

const Map = (props)=>{

  const [nextPlayer,setNextPlayer] = useState('Red');
  const [choose,setChoose] = useState([99,99]);
  const [chessType,setChessType] = useState(null);

  const mapInit = (num)=>{
    let A = AList.indexOf(num);
    let B = BList.indexOf(num);
    var result = null;
    if(A !== -1){
      result = {
        listName: listName[A],
        type: 'A'
      }
    }else if(B !== -1){
      result = {
        listName: listName[B],
        type: 'B'
      }
    }else {
      result = {
        listName: null,
        type: null
      }
    };
    return result;
  }
  
  const itemTouch = (e)=>{
    let point = Number(e.target.dataset.index);
    //判断是否为首次选子
    if(choose[0] === 99){//选子状态
      //合理判断
      if(nextPlayer === 'Red'){
        if(AList.indexOf(point) === -1){
          message.warn('选子错误！');
          return;
        }else{//合理 -> 记录棋子类型
          setChessType( AList.indexOf(point) );
        }
      }else{
        if(BList.indexOf(point) === -1){
          message.warn('选子错误！');
          return;
        }else{//合理 -> 记录棋子类型
          setChessType( BList.indexOf(point) );
        }
      }
      //合理 -> 选子
      setChoose([point,99]);
    }else{//落子状态
      //落子逻辑 -> 落子点判断
      const fristPoint = mapPOS.indexOf(choose[0]);
      const comparePoint = mapPOS.indexOf(point);
      const number = comparePoint - fristPoint;
      if( Math.abs(number) === 7 || Math.abs(number) === 1){//距离计算 value：1
        //下水判断
        if( mapRiver.indexOf(point) !== -1 ){// 落子点 是否为水
          if(chessType === 0){

          }else{
            message.warn('落子错误，只有鼠才能入水！');
            return
          }
        }
      }else if(chessType === 6 || chessType === 5){
        console.log(`当前位置：${choose[0]}`);
        if(mapRiverBank.indexOf(choose[0]) !== -1){//河岸判断
          if( Math.abs(number) === 28 || Math.abs(number) === 3){//距离计算 value：3 || 2

          }else{
            message.warn('落子错误，你怎么跃的？！');
            return;
          }
        }else{
          message.warn('落子错误，前往河岸才可跳跃！');
          return;
        }
      }else{
        message.warn('落子错误，行动格错误！');
        return;
      }
      // -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
      //   吃子 && 行动 逻辑过程
      // -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
      if(nextPlayer === 'Red'){//玩家判断 -> Red行动
        if( AList.indexOf(point) === -1){//踩子判断
          //吃子判断
          const enemy = BList.indexOf(point);
          if(enemy !== -1){// 落子点 踩敌判断
            // 踩敌 -> 大小比拼
            if( chessType > enemy ){
              //列表移除
              BList[enemy] = 99;
            }else if( chessType === 0 && enemy === 7){//特殊点 1 鼠象关系
              //列表移除
              BList[enemy] = 99;
            }else if( mapTrap.indexOf(point) !== -1 ){//陷阱判断
              //列表移除
              BList[enemy] = 99;
            }else{
              message.warn('落子错误，打不过！');
              return;
            }
          }
          //棋格行动
          const obj = AList.indexOf(choose[0]);
          AList[obj] = point; 
        }else{
          message.warn('落子错误，落子点有同伴！');
          return;
        }
      }else{//Blue行动
        if( BList.indexOf(point) === -1){//踩子判断
          //吃子判断
          const enemy = AList.indexOf(point);
          if(enemy !== -1){// 落子点 踩敌判断
            // 踩敌 -> 大小比拼
            if( chessType > enemy ){
              //列表移除
              AList[enemy] = 99;
            }else if( chessType === 0 && enemy === 7){
              //列表移除
              AList[enemy] = 99;
            }else if( mapTrap.indexOf(point) !== -1 ){//陷阱判断
              //列表移除
              AList[enemy] = 99;
            }else{
              message.warn('落子错误，打不过！');
              return;
            }
          }
          //棋格行动
          const obj = BList.indexOf(choose[0]);
          BList[obj] = point;
        }else{
          message.warn('落子错误，落子点有同伴！');
          return;
        }
      }
      //游戏结束状态判断
      if(gameOver.indexOf(point) !== -1){
        alert(`游戏结束，恭喜${nextPlayer}胜利\n点击确认重新开始！！`);
        window.location.reload();
      }
      //落子还原 -=-=- 结束动作
      setChoose([99,99]);
      setChessType(null);
      if( nextPlayer === 'Red' )setNextPlayer('Blue');
      else setNextPlayer('Red');
    }
  }

  const listRush = () =>{
    const mapAll = [];
    let mapLine = [];
    list.forEach(function(item,index) {
      const { listName, type } = mapInit(index);
      mapLine.push(
      <Item 
      key={index} 
      typeId={item}
      classType={(type === 'B')?'typeB':((type === 'A')?'typeA':'')}
      isChoose={ (choose[0] === index || choose[1] === index) ? (nextPlayer==='Red'?'typeACHO':'typeBCHO') : ''}
      name={listName||''} 
      onClick={ (event) => itemTouch(event) }
      index={index}/>);
      if( (index + 1) % 7 === 0 ){
        mapLine.push(<br/>);
        let parentLine = <div className="parentLine">{mapLine}</div>
        mapAll.push(parentLine);
        mapLine = [];
      }
    })
    return mapAll;
  }
    
    return (
      <div className='gameParent'>
        <div className='title'>{`next player:${nextPlayer}`}</div>
        {
          listRush()
        }
      </div>
    )
}

export default Map;